<template>
	<view class="container">
		<view class="swiper">
			<swiper :indicator-dots="true" :autoplay="true" :interval="3000" :duration="1000" indicator-active-color="pink"
			style="height: 850rpx;">
			<!-- <swiper-item v-for="item in swiperList" :key="item.id">
				<view class="swiper-item">
					<image :src="item.iurl" mode=""></image>
				</view>
			</swiper-item> -->
			<swiper-item>
				<view class="swiper-item">
					<image src="/static/dl/dl1.jpg" mode=""></image>
				</view>
			</swiper-item>
			<swiper-item>
				<view class="swiper-item">
					<image src="/static/dl/dl2.jpg" mode=""></image>
				</view>
			</swiper-item>
			<swiper-item>
				<view class="swiper-item">
					<image src="/static/dl/dl3.jpg" mode=""></image>
				</view>
			</swiper-item>
		</swiper>
		</view>
		<view class="content">
			<view>welcome to</view>
			<view>奶茶点餐</view>
			<view>源自奶茶的美</view>
		</view>
		<view class="bth">
			<button @click="toLoginPage()">
				登录
			</button>
			<button @click="toRegisterPage()">
				注册
			</button>
		</view>
		
	</view>
</template>

<script>
	// import{
	// 	queryImageByType
	// }from"../../API/index.js"
	export default {
		data() {
			return {
				swiperList:[]
			}
		},
		onShow() {
			this.getSwiperList()
		},
		methods: {
			getSwiperList(){
				getSwiperList(1).then(res=>{
					this.swiperList=res.data
				})
			},
			
			toLoginPage(){
				uni.navigateTo({
					url:"/pages/login/login"
				})
			},
			toRegisterPage(){
				uni.navigateTo({
					url:"/pages/reqister/reqister"
				})
			}
		}
	}
</script>

<style scoped>
.swiper image{
	width: 100%;
	height: 400px;
}
.content{
	padding: 30rpx;
	box-sizing: border-box;
}
.content view:nth-child(1),
.content view:nth-child(3){
	font-weight: bold;
	font-size: 30rpx;
	color: #48647a;
}
.content view:nth-child(2){
	font-weight: bold;
	color: darksalmon;
	font-size: 30px;
	margin-top: 20rpx;
	margin-bottom: 20rpx;
}
.bth button:nth-child(1){
	margin-top: 10rpx;
	width: 80%;
	background-color: darksalmon;
	color: #fff;
	font-weight: bold;
	border-radius: 10px;
}
.bth button:nth-child(2){
	width: 80%;
	background: #ffe8e8;
	color: #fe8787;
	font-weight: bold;
	border-radius: 10px;
	margin-top: 20rpx;
}
</style>
